<template>
    <div class="mentMethodWarp">
        <div class="payment">
            <!--多系统-->
            <div class="multisystem" v-if="tableData.length>0">
                <div class="totalWarp">
                    <label>合计：{{countNum.orderCount}} 笔订单</label>
                    <label class="price">
                        总支付金额：
                        <span>&yen; {{countNum.sumPrice}}</span>
                    </label>
                </div>
                <el-table :data="tableData" header-cell-class-name="header-cell" cell-class-name="row-cell" border style="width: 100%">
                    <el-table-column prop="projectName" label="商品名称" width="325">
                    </el-table-column>
                    <el-table-column prop="orderDetilesId" label="交费单号" width="325">
                    </el-table-column>
                    <el-table-column label="金额" width="324">
                        <template slot-scope="scope">
                            <span style="color: #E32424;font-weight:bold;">&yen; {{ scope.row.realProjectPrice }}</span>
                        </template>
                    </el-table-column>
                </el-table>
            </div>

            <!--单商品-->
            <div class="singleItem" v-else>
                <p>商品名称：<label>{{orderInfo.projectName}}</label></p>
                <p>交易单号：<label>{{orderInfo.orderDetilesId}}</label></p>
                <p>支付金额：<label>&yen; {{countNum.sumPrice}}</label></p>
            </div>
        </div>

        <div class="paymentMethod">
            <div class="tabBtn">
                <label :class="payment===1?'tabActive':''" @click="handlePaymentMethod(1)"><i class="iconfont iconzfb"></i>支付宝</label>
                <label :class="payment===2?'tabActive':''" @click="handlePaymentMethod(2)"><i class="iconfont iconwx"></i>微信</label>
            </div>
            <div class="scanning">
                <div class="way">
                    <label>{{payment===1?'支付宝支付':'微信支付'}}</label>
                    <el-link class="aLink" type="info">打开{{payment===1?'支付宝':'微信'}}扫一扫，扫描下方二维码完成支付</el-link>
                </div>
                <div class="codeImg">
                    <div class="code">
                        <el-image :src="payment == 1?zfbCode:codeUrl"></el-image>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>
<script src="./index.js"></script>
<style lang="scss" src="./index.scss"></style>
